<template>
	<view class="content" >
		
		
		<citySelect v-if="showdata" :existOrder.sync="priceList"   @cityClick="cityClick" :formatName="formatName" :hotCity="hotCity" :obtainCitys="obtainCitys"
			:isSearch="true" ref="citys" @cz='ordernum'></citySelect> 
		
		<view v-else class="" style="text-align: center;margin-top: 100rpx;">
			我的-客户管理中添加收货人信息后，可批量发货
		</view>
		
		<view class="sure_order"  style="overflow: hidden;box-sizing: border-box;">
			<view class="order_info" style="width: 55%;">
				<view class="qcfd" style="display: flex;justify-content: space-between;">
					<view class="orders">
						合计
					</view>
					<view class="" style="font-size: 24rpx;">
						<text style="font-size: 38rpx;">{{numOrders}}</text>单
					</view>
					<view @click="priceChanges" class="order_list qcfd" style="width: 100px;">
						<text class="fl">查看订单列表</text>
						<text class="fl"
							:class="xzsj"></text>
					</view>
					
		
				</view>
				<view class="xieyi" style="position: relative;background-color: #2C2C2D;">
					<uni-group style="margin-top: -10rpx;">
						<uni-data-checkbox multiple v-model="formData.hobby" :localdata="hobby"
							@fsjs='jsfs'>
						</uni-data-checkbox>
						<view class="" style="position: absolute;top: -10rpx;left: 40rpx;background-color: #2C2C2D;">
							<text @click="djagree" style="color: #ACACAC;">阅读同意</text><text style="color: #277BF9 ;"  @click="djxy">《电子运单协议》</text>
						</view>
					</uni-group>
				</view>
			</view>
			<view class="order_btn" style="padding: 10rpx 0;box-sizing: border-box;">
				<button @click="makeOrder('form')" type="default">立即下单</button>
			</view>
		</view>
		<jsfun-picker :isShow="isShows" plfhh="150"  :listArr="priceList" :defaultArr="priceDefault" @clear="clearList"
			@delete="abcd" @deleteOrder='dele'  @gb='xzjd'>
			<!-- 自定义页面显示元素 -->
			
		</jsfun-picker>
	</view>
	
</template>

<script>
	import citySelect from "@/components/plfhc/city-select.vue"
	import citys from './citys.js'
	import requestUrl from '@/index.js';
	import jsfunPicker from '@/components/jsfun-picker/jsfun-picker.vue'
	export default {
		data() {
			return {
				priceList: [],
				//需要构建索引参数的名称（注意：传递的对象里面必须要有这个名称的参数）
				formatName: 'title',
				//当前城市
				activeCity: {
					id: 0,
					title: ''
				},
				xzsj:'dsjx',
				showdata:true,
				qty: '',
				shipId: '',
				deliveryId: '',
				payer: '',
				orderType: '',
				numOrders: 0,
				hobby: [{
					
					value: 1
				}],
				formData: {
					value: 1,
					hobby: []
				},
				isShows:false,
				//热门城市
				// hotCity: [
				// 	{
				// 		id: 0,
				// 		title: '南京市'
				// 	},
				// 	{
				// 		id: 1,
				// 		title: '南京市'
				// 	}
				// ],
				//显示的城市数据
				obtainCitys: [
					// {
					// 	id: 0,
					// 	title: '南京'
					// },
					// {
					// 	id: 1,
					// 	title: '北京'
					// },
					// {
					// 	id: 2,
					// 	title: '天津'
					// },
					// {
					// 	id: 3,
					// 	title: '东京'
					// }
				],
				shipId:'',
				shipAddress:'',
				shipUser:'',
				shipTel:''
			}
		},
		components: {
			citySelect,
			jsfunPicker
		},
		async onShow() {
			uni.showLoading({
				title:'加载中'
			})
			
			
			if(uni.getStorageSync('agree')){
				this.formData.hobby.push(uni.getStorageSync('agree'))
			}
			this.shipId = uni.getStorageSync('fhrid')
			if(uni.getStorageSync("token")){
				await this.priceChange()
				let res = await this.$request.get(this.$requestUrl.GET_ADRESS_URL, {
					data: {
						type: 2,
						isTms:0
					}
				});
				this.citys = res;
				setTimeout(function(){
					uni.hideLoading()
				},2000)
				
				this.$api.msg(res || '系统繁忙，请稍后重试')
			}
			
			if(uni.getStorageSync('token')&&this.citys.length>0){
				this.showdata=true
			}else{
				this.showdata=false
			}
		},
		onLoad() {

			//动态更新数据
			setTimeout(() => {

				//修改数据格式
				this.formatName = 'receiver'
				//修改当前城市
				//修改热门城市
				// this.hotCity = [
				// 	{
				// 		cityName: '南京',
				// 		cityCode: 110100
				// 	},
				// 	{
				// 		cityName: '北京',
				// 		cityCode: 110102
				// 	}
				// ]
				//修改构建索引数据
				this.obtainCitys = this.citys
				// uni.showToast({
				// 	icon: 'none',
				// 	title: '更新数据成功',
				// 	// #ifdef MP-WEIXIN
				// 	duration: 1000,
				// 	// #endif
				// 	mask: true
				// })
			}, 1000)
		},
		methods: {
			priceChanges() {
				// this.$refs.mychild.showPicker()
				if(this.isShows){
					this.isShows=!this.isShows
				}else{
					this.isShows=!this.isShows
				}
				
				if(this.xzsj == 'sjx'){
					this.xzsj = 'dsjx'
				}else{
					this.xzsj='sjx'
				}
			},
			xzjd(){
				this.xzsj='dsjx'
				this.isShows=false
			},
			djagree(){
				if(this.formData.hobby.length>0){
					this.formData.hobby=[]
					
				}else {
					this.formData.hobby.push(1)
					uni.setStorageSync('agree', 1)
				}
			},
			djxy(){
				uni.navigateTo({
					url:"../xieyi/xieyi"
				})
			},
			ordernum(data) {
				this.priceChange()
				this.numOrders = data
			},
			jsfs(data) {
				if(data.length>0){
					uni.setStorageSync('agree',1)
				}
				 this.formData.hobby=data
			},

			async priceChange() {
				console.log('cnmde')
				let res = await this.$request.get(this.$requestUrl.GET_ORDERS_url, {
					data: {
						orderType: 2,
					}
				});

				
				if (res.length > 0) {
					this.priceList = res
					this.numOrders = res.length
					console.log('this.numOrders',this.numOrders)
				}
				
				
			},
			radioc(evt) {
				this.xieyi = evt.target.value
			},
			async clearList() {
				console.log('清空列表')
				let res = await this.$request.post(this.$requestUrl.DELE_ORDER_URL, {
					data: {
						status: -1,
						orderType: 2,
					}
				});
				this.priceList = res

				this.numOrders = res.length
				
			},

			async abcd(data, item) {

				if (item.qty !== data) {
					let res = await this.$request.post(this.$requestUrl.XGORDER_URL, {
						data: {
							serial: item.serial,
							qty: data,
							orderType:2
						}
					});
					this.priceList = res
					
				}
			},
			async dele(item) {
				let res = await this.$request.post(this.$requestUrl.DELE_ORDER_URL, {
					data: {
						serial: item.serial,
						status: 0,
						orderType:2
					}
				});
				this.priceList = res
				this.numOrders = res.length
			},
			async makeOrder() {
				if (this.formData.hobby.length==0) {
					return this.$api.msg('请阅读并同意下方协议')
				}
				await this.priceChange()
				
				if(this.numOrders>0){
					let arr = []
					
					for (let i = 0; i < this.priceList.length; i++) {
						let data = {}
						data.go_adress=this.priceList[i].deliveryProvince+this.priceList[i].deliveryCity+this.priceList[i].deliveryArea+this.priceList[i].deliveryAddress
						data.deliveryId=this.priceList[i].deliveryId
						data.go_phone=this.priceList[i].deliveryTel
						data.go_name=this.priceList[i].deliveryUser
						data.ps_type=this.priceList[i].orderType
						data.payer=this.priceList[i].payer
						data.qty=this.priceList[i].qty
						 data.shipAddress=this.priceList[i].shipAddress
						 data.shipArea=this.priceList[i].shipArea
						 data.shipCity=this.priceList[i].shipCity
						data.shipId=this.priceList[i].shipId
						 data.shipTel=this.priceList[i].shipTel
						 data.shipProvince=this.priceList[i].shipProvince
						 data.shipUser=this.priceList[i].deliveryUser
						 data.goods_name=this.priceList[i].goodsName
						arr.push(data)
					}
					uni.navigateTo({
						url: '../confirmOrder/confirmOrder?data=' + JSON.stringify(arr)
					})
				}else{
					this.$api.msg('请点击确定按钮')
				}
				
			},



			// this.$refs.citys.printAge(item);
			// 	uni.showToast({
			// 		icon: 'none',
			// 		title: 'item: ' + JSON.stringify(item),
			// 		// #ifdef MP-WEIXIN
			// 		duration: 30000,
			// 		// #endif
			// 		mask: true
			// 	});
			// },

		},
		async getDeliver() {
			let res = await this.$request.get(this.$requestUrl.GET_ADRESS_URL, {
				data: {
					type: 1,
					isTms: this.istms
				}
			});
			if (res.length > 0) {
				this.cjbs = ''
				this.shipUser= res[res.length - 1].sender 
				this.shipId = res[res.length - 1].id
				this.shipTel= res[res.length - 1].senderPhone
				this.shipAddress=res[res.length - 1].address
		
			} else {
				this.fhrinfo = ''
				this.shipId = ''
		
			}
			this.$api.msg(res || '系统繁忙，请稍后重试')
		},
	}
</script>

<style>
	.header {
		background-color: #FFFFFF;
		padding: 8rpx 24rpx;
	}

	.header input {

		height: 72rpx;
		border-radius: 36rpx;
		background: url(/static/scpf/sousuo.png) no-repeat;
		background-color: #F4F3F3;
		background-position: 32rpx;
		padding-left: 80rpx;
		outline: none;
	}

	.locations {
		padding: 20rpx 24rpx;
		font-size: 28rpx;
		color: #7B7B7B;
	}

	.loca_aderss {
		width: 306rpx;
		margin: 24rpx;
		padding: 18rpx 24rpx;
		background-color: #FFFFFF;
		border-radius: 8rpx;
		font-size: 32rpx;
		color: #2C2C2D;
		font-weight: 500;

	}

	.loca_aderss image {
		width: 28rpx;
		height: 32rpx;
	}

	.sure_order {
		width: calc(100% - 52rpx);
		position: fixed;
		bottom: 40rpx;
		left: 26rpx;
		display: flex;
		justify-content: space-between;
		background-color: #2D2D2D !important;
		border-radius: 16rpx;
		padding: 16rpx 24rpx;
		color: #FFFFFF;
		z-index: 99;
	}

	.orders {
		font-size: 28rpx;
		margin-top: 8rpx;
		font-weight: 400;
	}

	.order_list {
		font-size: 24rpx;
		color: #FF690D;
		margin-top: 12rpx;
	}

	.xieyi {
		margin-top: 12rpx;
	}

	.xieyi text {
		font-size: 24rpx;
	}

	.order_btn button {

		width: 192rpx;
		height: 80rpx;
		background: #FF690D;
		border-radius: 40rpx;
		font-size: 32rpx;
		line-height: 80rpx;
		color: #FFFFFF;
		margin-top: 4rpx;
	}
	
	.sjx {
		display: inline-block;
		width: 12rpx;
		height: 12rpx;
		border-left: 2rpx solid #FF690D;
		border-bottom: 2rpx solid #FF690D;
		transform: rotate(-45deg);
		margin-left: 12rpx;
		margin-top: 8rpx;
	
	}
	.dsjx {
		display: inline-block;
		width: 12rpx;
		height: 12rpx;
		border-left: 2rpx solid #FF690D;
		border-bottom: 2rpx solid #FF690D;
		transform: rotate(135deg);
		margin-left: 12rpx;
		margin-top: 14rpx;
	
	}
</style>
